﻿

<div class="container">
    <script type="text/javascript">

        function HomeIndexCtrl($scope, $http) {
            $http.get("/api/Field").success(function (data) {
                $scope.fields = data;
            }).error(function (header, status, data, config) {
                window.alert("Problem u komunikaciji!");
            });
        }

    </script>
    <div class="col-md-4 col-md-push-8">
        <div class="panel panel-default">
            <div class="panel-body">
                <img class="img-circle center-block" src="https://lh5.googleusercontent.com/-b0-k99FZlyE/AAAAAAAAAAI/AAAAAAAAAAA/eu7opA4byxI/photo.jpg?sz=120">
                <br /><div class="jumbotron">
                    <h3>Statistika</h3>
                    <table class="table">
                        <tr>
                            <td>key</td>
                            <td>value</td>
                        </tr>
                        <tr>
                            <td>key</td>
                            <td>value</td>
                        </tr>
                        <tr>
                            <td>key</td>
                            <td>value</td>
                        </tr>
                        <tr>
                            <td>key</td>
                            <td>value</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div ng-controller="HomeIndexCtrl" class="col-md-8 col-md-pull-4">
     
        <div ng-repeat="field in fields" class="thumbnail panel panel-default">
            <img class="img-responsive" data-src="{{field.Picture}}" alt="{{field.FieldName}} picutre">
            <div class="caption panel-body">
                <h3>{{field.FieldName}}</h3>
                <p>{{field.Description}}</p>
                <p><a href="/home/field/{{field.FieldId}}" class="btn btn-primary" role="button">Vidi kurseve</a></p>
            </div>
        </div>

    </div>

    <script type="text/javascript">
        function AlertDemoCtrl($scope) {
            $scope.alerts = [
              { type: 'danger', msg: 'Oh snap! Change a few things up and try submitting again.' },
              { type: 'success', msg: 'Well done! You successfully read this important alert message.' }
            ];

            $scope.addAlert = function () {
                $scope.alerts.push({ msg: "Another alert!" });
            };

            $scope.closeAlert = function (index) {
                $scope.alerts.splice(index, 1);
            };

        }
    </script>
    <div ng-controller="AlertDemoCtrl">
        <alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{alert.msg}}</alert>
        <button class='btn btn-default' ng-click="addAlert()">Add Alert</button>
    </div>
</div>